<%--
  Created by IntelliJ IDEA.
  User: lenovo
  Date: 2025/5/18
  Time: 20:48
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<html>
<head>
    <title>个人中心</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link type="text/css" rel="stylesheet" href="css/base.css">
    <link type="text/css" rel="stylesheet" href="css/common.css">
    <link type="text/css" rel="stylesheet" href="css/index.css">
    <script type="text/javascript" src="js/user.js" defer></script>
</head>
<body>

<%-- 检查用户是否登录 --%>
<c:if test="${empty user}">
    <% response.sendRedirect(request.getContextPath() + "/user_login.jsp"); %>
</c:if>

<%--显示消息提示--%>
<c:if test="${not empty msg}">
    <script>
        alert("${msg}");
    </script>
</c:if>

<%--header--%>
<jsp:include page="header.jsp"></jsp:include>

<%--个人中心界面--%>
<div class="user-center">
    <h1 class="center-title">个人中心</h1>
    <h3 class="personal-information-title">个人资料</h3>
    <%--此form表单中后面都要新增value值（除头像外），把登录进来的用户信息显示出来--%>
    <form class="personal-information-form" action="${pageContext.request.contextPath}/changeUserInformation" method="post" enctype="multipart/form-data">

        <div class="user-center-form-group">
            <label for="change-avatar">头像</label>
<%--            实现头像预览--%>
            <div class="change-avatar-preview">
<%--                这里的src要改成后端返回的URL地址，先用具体替代，后更改--%>
                <img id="change-avatar-img" src="${empty user.avatar ? '/picture/avatar.png' : user.avatar}" alt="用户头像">

            </div>
            <input type="file" id="change-avatar" name="changeAvatar" accept="image/*">
        </div>

        <div class="user-center-form-group">
            <label for="change-nickname">昵称</label>
            <input type="text" id="change-nickname" name="changeNickname" value="${user.nickname}" placeholder="请输入昵称">
        </div>

        <div class="user-center-form-group">
            <label for="change-username">用户名</label>
            <input type="text" id="change-username" name="changeUsername" value="${user.username}" placeholder="请输入用户名">
        </div>

        <div class="user-center-form-group">
            <label for="change-email">邮箱</label>
            <input type="email" id="change-email" name="changeEmail" value="${user.email}" placeholder="请输入邮箱">
        </div>

        <div class="button-group">
            <button type="submit" class="saveChangesBtn">保存修改</button>
        </div>

    </form>

    <h3 class="account-security-title">账号安全</h3>
    <form class="account-security-form" action="${pageContext.request.contextPath}/changeUserPassword" method="post">
        <div class="user-center-form-group">
            <label for="original-password">原密码</label>
            <input type="password" id="original-password" name="originalPassword" placeholder="请填写原密码">
        </div>

        <div class="user-center-form-group">
            <label for="new-password">新密码</label>
            <input type="password" id="new-password" name="newPassword" placeholder="请填写新密码">
        </div>

        <div class="user-center-form-group">
            <label for="confirm-new-password">确认密码</label>
            <input type="password" id="confirm-new-password" name="confirmNewPassword" placeholder="请再次填写新密码">
        </div>

        <div class="button-group">
            <button type="submit" class="saveChangesBtn">保存修改</button>
        </div>
    </form>
</div>

<%--footer--%>
<jsp:include page="footer.jsp"></jsp:include>


</body>
</html>
